import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import { DNavBar, DImagesupload, DSelectColor, DAtInpute } from '@/components'
import { AtForm, AtButton } from 'taro-ui'
import sdk from '@/common/sdk'
import common from '@/common/'
import './addfinancingcar.scss'

export default class AddfinancingcarBox extends Component {

    constructor(props) {
        super(props)
        this.state = {
            title: '添加库融车辆',
            isOpened: false,
            carList: {},
            colorKey: '',
            colorCount: 0,
            selectColor: ''
        }
    }

    componentDidShow() {
        this.getBrandInfo()
        sdk.setTitleInfo(this.state.title)
    }

    getBrandInfo() {
        let _brandList = sessionStorage.getItem('brandList')
        if (!_brandList) {
            return
        }
        let { carBrandId = '', neiguanyanse = '',waiguanyanse = '',carBrandLogo = '', carModel = '', carSourceType = '', carGuiPrice = '', carModelId = '' } = JSON.parse(_brandList)
        this.bindCarform('adCarType', carModel)
        this.bindCarform('adCarPrice', carGuiPrice)
		debugger
		this.setState({
			neiguanyanse,
			waiguanyanse
		},()=>sessionStorage.removeItem('brandList'))
        
    }

    onChangeCar() {
        Taro.navigateTo({
            url: '/pages/choosebrand/choosebrand'
        })
    }

    onSubmitHandle(value) {
        let { colorKey } = this.state
        let color = []
        value.map(item => {
            color.push(item.color)
        })
        this.bindCarform(colorKey, color.join('/'))
        this.setState({
            isOpened: false
        })
    }

    onSubmit() {
        let { carList } = this.state
        // if (Object.keys(carList).length === 0) {
        //     return Taro.showToast({
        //         icon: 'none',
        //         title: '您尚有信息未填写，请完善后提交'
        //     })
        // }
        let _carList = ['adCarType', 'adCarNo', 'adCarPrice', 'adMoney', 'adKeys', 'adOutColor', 'adInColor', 'imageUrl']
        // let _carList = ['adCarType', 'adCarNo', 'adCarPrice', 'adMoney', 'adKeys', 'adOutColor', 'adInColor']
        let status = false, _item = '',
            objtext = {
                adCarType: '请选择融资车型',
                adCarNo: '请输入车架号',
                adMoney: '请输入库存金额',
                adKeys: '请输入车辆钥匙数量',
                adOutColor: '请选择外观颜色',
                adInColor: '请选择内饰颜色',
                imageUrl: '请上传车辆合格证照片'
            }
        // _carList.map(item => {
        //     if (!carList[item]) {
        //         status = true
        //     }
        // })
        for (let i = 0, j = _carList.length; i < j; i++) {
            if (!carList[_carList[i]]) {
                status = true
                _item = objtext[_carList[i]]
                break
            }
        }
        if (status) {
            return Taro.showToast({
                icon: 'none',
                title: _item
            })
        }

        sessionStorage.setItem('_carList', JSON.stringify(carList))

        Taro.showToast({
            title: '已成功添加车辆',
            duration: 800
        }).then(() => {
            setTimeout(() => {
                Taro.navigateBack({
                    delta: 1
                })
            }, 1000);
        })
    }

    onRightHanlde(key) {
		let {waiguanyanse,neigaunyanse} = this.state
			 let isOut =  key === 'adOutColor'
		
		    debugger
        this.setState({
            isOpened: true,
            colorKey: key,
			listColr:common.getSplitColor(isOut?waiguanyanse:neigaunyanse),
            colorCount: key === 'adOutColor' ? 0 : 2,
            selectColor: this.state.carList[key]
        })
    }

    bindCarform = (key, value) => {
        if (key) {
            this.setState({
                carList: Object.assign(this.state.carList, { [key]: value })
            })
        }
    }

    onCancelHandle() {
        this.setState({
            isOpened: false
        })
    }

    onLookImages() {
        Taro.navigateTo({
            url: `/pages/itemImages/itemImages?status=carsuccess`
        })
    }

    render() {
        const {
            isOpened,
            carList,
            colorCount,
			listColr,
            selectColor,
            title
        } = this.state
        const _bindCarform = function (value) {
            this.bindCarform(arguments[arguments.length - 1].bind, value)
        }
        const _imageList = function (key, value) {
            let _imageUrl = value[0].url
            this.bindCarform(key, _imageUrl)

        }
        return (
            <View className='b_addfinancingcar'>
                <DNavBar title={title}></DNavBar>
                <View className='b_addfinancingcar__box'>
                    <View className='b_addfinancingcar__form'>
                        <AtForm>
                            <View className='b_addfinancingcar__form__item'>
                                <DAtInpute require={true} value={carList.adCarType} onChange={_bindCarform.bind(this)} bind='adCarType' title='车型' icon='chevron-right' placeholder='请选择融资车型' onRightHanlde={this.onChangeCar.bind(this)}></DAtInpute>
                                <DAtInpute require={true} value={carList.adCarNo} onChange={_bindCarform.bind(this)} bind='adCarNo' title='车架号' maxLength={17} placeholder='请输入车架号'></DAtInpute>
                                <DAtInpute value={carList.adCarPrice} onChange={_bindCarform.bind(this)} bind='adCarPrice' type='number' title='市指导价'>
                                    <Text className='item_text'>万</Text>
                                </DAtInpute>
                                <DAtInpute type='number' require={true} value={carList.adMoney} onChange={_bindCarform.bind(this)} bind='adMoney' title='库融金额' placeholder='请输入库存金额'>
                                    <Text className='item_text'>万</Text>
                                </DAtInpute>
                                <DAtInpute require={true} value={carList.adKeys} onChange={_bindCarform.bind(this)} bind='adKeys' type='number' title='钥匙数量' placeholder='请输入车辆钥匙数量'></DAtInpute>
                                <DAtInpute require={true} value={carList.adOutColor} onChange={_bindCarform.bind(this)} bind='adOutColor' title='外观颜色' icon='chevron-right' placeholder='请选择外观颜色' onRightHanlde={this.onRightHanlde.bind(this, 'adOutColor')}></DAtInpute>
                                <DAtInpute require={true} value={carList.adInColor} onChange={_bindCarform.bind(this)} bind='adInColor' title='内饰颜色' icon='chevron-right' placeholder='请选择内饰颜色' onRightHanlde={this.onRightHanlde.bind(this, 'adInColor')}></DAtInpute>
                                <View className='b_addfinancingcar__images'>
                                    <View className='item_title'>
                                        <Text className="b_addfinancingcar__images_title">车辆合格证照片</Text>
                                        <Text className="item_title__right" onClick={this.onLookImages.bind(this)}>查看范例</Text>
                                    </View>
                                    <DImagesupload count={1} value={carList.imageUrl} bind='imageUrl' onChangeImages={_imageList.bind(this, 'imageUrl')} ></DImagesupload>
                                </View>
                            </View>
                        </AtForm>
                    </View>
                    <View className='b_addfinancingcar__footer'>
                        <AtButton className='item_btn' onClick={this.onSubmit.bind(this)}>保存添加</AtButton>
                    </View>
                </View>

                <DSelectColor list={listColr} count={colorCount} value={selectColor} isOpened={isOpened} onCancelHandle={this.onCancelHandle.bind(this)} onSubmitHandle={this.onSubmitHandle.bind(this)}></DSelectColor>
            </View>
        )
    }
}